<template>
	<el-container>
	  <el-header class="header3">
		  <el-date-picker
		        v-model="value1"
		        type="date"
		        placeholder="选择日期">
		      </el-date-picker>
			  <el-button type="primary" @click="searchfinance">搜索</el-button>
	  </el-header>
	  <el-main class="main3">
		  <el-row :gutter="40">
		    <el-col :span="15">
				<el-table
				    :data="financedata"
				    border
				    style="width: 100%;text-align:center;"
								>
					<el-table-column
							label="编号"
							type="index"
							width="50">
					</el-table-column>
					<el-table-column
						label="状态"
						prop="verifymark"
						width="50">
						<template slot-scope="scope" >
							<span slot="reference" v-if="scope.row.verifymark == 1">
								<i class="dotClass" style="background-color: springgreen"></i>
							</span>
							<span slot="reference" v-if="scope.row.verifymark == 0" >
								<i class="dotClass" style="background-color: red"></i>
							</span>
						</template>
						</el-switch>
						</el-table-column>
					<el-table-column
						 prop="commodityid"
							label="商品编号"
							width="100">
						</el-table-column>
						<el-table-column
							prop="commodityname"
							label="商品名称"
							width="200">
						</el-table-column>
						<el-table-column
							prop="commoditynum"
							label="商品数量(件)"
							width="110">
						</el-table-column>
						<el-table-column
							prop="commodityprice"
							label="商品价格(元)"
							width="110">
						</el-table-column>
								<el-table-column
									prop="totalprice"
									label="商品总价(元)"
									width="150">
								</el-table-column>
							  
				  </el-table>
				  <el-pagination
				  	background
				  	@size-change="size_change"
				  	@current-change="current_change"
				  	:current-page=pageNum 
				  	:page-size = 5
				  	layout="prev, pager, next"
				  	:total= "total">
				  </el-pagination>
			</el-col>
		    <el-col :span="9">
				<el-card class="box-card" style="width: 300px;">
				  总金额：
				  <el-input
				    v-model="sumtotalprice"
				    :disabled="true">
				  </el-input><el-divider></el-divider>
				  <el-button type="primary" @click="verify">核实</el-button>
				</el-card>

			</el-col>
		  </el-row>
		  
	  </el-main>
	  
	</el-container>
</template>

<script>
	var padaDate = function(value){
	     return value<10 ? '0'+value : value;
	  };
	export default {
		name: 'conservator',
		data() {
			return {
				value1: '',
				date: '',
				financedata:[],
				pageNum: 1,
				total: 0,
				sumtotalprice:'',
			}
		},
		
		methods: {
			searchfinance() {
				var year = this.value1.getFullYear();
				var month = padaDate(this.value1.getMonth()+1);
				var day = padaDate(this.value1.getDate());
				this.date = year+'-'+month+'-'+day;
				// console.log(this.date);
				
				var url = "http://localhost:8848/finance/search?financedata="+this.date+"&pagenum="+this.pageNum;
				// console.log(url);
				
				this.$axios.get(url)
				.then( (resp) => {
					var u = resp.data;
					
					this.financedata = u.list;
					this.pageNum = u.pageNum;
					this.total = u.total;
					// console.log(u.list);
				})
				.catch( (err) => {
					console.log("error=", err);
				})
				this.sumprice();
			},
			signdel(index, row) {
				var url = "http://localhost:8848/finance/signdel?id="+row.id;
				// console.log(url);
				
				this.$axios.get(url)
				.then( (resp) => {
					var u = resp.data;
					
					if (u == 1) {
						this.$message.success("已标记");
					}
					else {
						this.$message.error("标记失败")
					}
				})
				.catch( (err) => {
					console.log("error=", err);
				})
				this.searchfinance();
			},
			unsigndel(index, row) {
				var url = "http://localhost:8848/finance/unsigndel?id="+row.id;
				// console.log(url);
				
				this.$axios.get(url)
				.then( (resp) => {
					var u = resp.data;
					
					if (u == 1) {
						this.$message.success("已取消标记");
					}
					else {
						this.$message.error("取消标记失败")
					}
				})
				.catch( (err) => {
					console.log("error=", err);
				})
				this.searchfinance();
				
			},
			sumprice() {
				console.log(this.date);
				var url = "http://localhost:8848/finance/sumprice?financedata="+this.date;
				console.log(url);
				
				this.$axios.get(url)
				.then( (resp) => {
					var u = resp.data;
					
					this.sumtotalprice = u;
					console.log(this.sumtotalprice);
				})
				.catch( (err) => {
					console.log("error", err);
				})
			},
			verify() {
				var username = this.$route.params.username;
				
				this.$axios.post("http://localhost:8848/finance/verify", this.$qs.stringify({
					totalprice: this.sumtotalprice,
					finedate: this.date,
					username: username
				}))
				.then( (resp) => {
					var u = resp.data;
					
					if (u == 1) {
						this.$message.success("核对成功")
					}
					else {
						this.$message.error("核对失败")
					}
				})
				.catch( (err) => {
					console.log("error=", err);
				})
				this.searchfinance();
				
			},
			size_change(newSize){
			    this.pageSize = newSize
							   // this.inventorydate.push(this.pagelist);
							   //console.log(newSize);
			},
			//监听 页码值 改变的事件
			current_change(newPage){
			    this.pageNum = newPage
			    //this.comeindata.push(this.pagelist);
			    //console.log(newPage);
				this.searchfinance();
			},
		},
		
		
	}
</script>

<style>
</style>
